<template>
  <div class="pie">

  </div>
</template>

<script>
import * as echarts from 'echarts'
export default {
  data () {
    return {

    }
  },
  methods: {
    pie () {
      const echartsPie = echarts.init(document.querySelector('.pie'))
      const option = {
        legend: {
          top: '20%'
        },

        backgroundColor: '#020347',
        tooltip: {
          trigger: 'item'
        },
        series: [
          {
            type: 'pie',
            center: ['50%', '50%'],
            radius: ['24%', '45%'],

            roseType: 'radius',
            data: [{ name: '影像', value: 8 }, { name: '可见光影像', value: 2 }]
          }
        ]
      }
      echartsPie.setOption(option)
    }
  },
  mounted () {
    this.pie()
  }
}
</script>

<style scoped>
.pie{
  width: 400px;
height: 400px;
background-color: #8df;
margin-left: 20px;
}
</style>
